<template>
  <u-popup
    :custom-style="{ maxHeight: '800rpx', overflow: 'auto', padding: '32rpx' }"
    :show="show"
    closeOnClickOverlay
    @close="close"
  >
    <view>
      <view class="text-[32rpx] font-bold">优惠说明</view>
      <view class="text-xs font-bold mt-4">票档优惠</view>
      <view class="content flex items-start mt-2">
        <view class="maxOut mr-1">满减</view>
        <view class="flex-1">
          <view v-for="(item, index) in form.activitySessionBoList" :key="index">
            <view class="font-bold">{{ mostFormattedDate(item.sesStartTime, 'YYYYMMDDHHmmss', 'YYYY-MM-DD') }}</view>
            <view
              v-for="(i, idx) in item.activityPriceBoList"
              :key="idx"
              class="text-xs leading-relaxed text-[#696975]"
            >
              {{ i.prePrice / 100 }}票档,{{ priceText(i) }}
            </view>
          </view>
        </view>
      </view>
      <view class="text-[#696975] text-xs mt-3">
        说明：您选购优惠票档所对应的票品种类可能为套票、优惠票等
        类型，具体以您收到的票面信息标示为准。实际优惠情况以订单
        确认页为准。以上票档价格及优惠折扣基准价格均不含服务费。
      </view>
    </view>
  </u-popup>
</template>

<script lang="ts" setup>
import { mostFormattedDate } from '@/utils/date';

defineProps({
  show: {
    type: Boolean,
    default: false
  },
  form: {
    type: Object,
    default: () => ({
      activitySessionBoList: []
    })
  }
});

const emits = defineEmits(['update:show']);

const priceText = (params) => {
  if (params.preBuyType === 1) {
    return '无折扣';
  }
  if (params.preBuyType === 2) {
    return `满${params.preBuyNum}件,减${params.preBuyPre / 100}元`;
  }
  return `满${params.preBuyNum}件,打${params.preBuyPre / 100}折`;
};
const close = () => {
  emits('update:show', false);
};
</script>

<style lang="scss" scoped>
.content {
  .maxOut {
    @apply text-[#ffffff] pl-2 pr-2 pt-1 pb-1 bg-[#FF4852] flex items-center justify-center rounded text-xs;
  }
}
</style>
